<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="utf-8" />
    <title>{APP_NAME}</title>
    <link rel="stylesheet" href="{RESOURCES_PATH}/editor.md/css/style.css" />
    <link rel="stylesheet" href="{RESOURCES_PATH}/editor.md/css/editormd.css" />
    <link rel="stylesheet" href="{RESOURCES_PATH}/static/css/octicons.min.css">
    <link  rel="stylesheet" href="{RESOURCES_PATH}/layui/css/layui.css">
    <link rel="stylesheet" href="{RESOURCES_PATH}/static/css/index.css">
    <link rel="shortcut icon" href="https://pandao.github.io/editor.md/favicon.ico" type="image/x-icon" />
</head>
<body>
<div id="header"> </div>
<div id="content">
    <div id="toolbar" style="height: 702px;">
        <div class="toolbar-icon" title="新建" onclick="newNote(0, this)"><span class="octicon octicon-file-text"></span></div>
        <div class="toolbar-icon" title="新建分类" onclick="newNotebook()"><span class="octicon octicon-file-directory"></span></div>
        <div class="toolbar-icon" title="保存" onclick="saveNote()"><span class="fa fa-lg fa-floppy-o"></span></div>
        <div class="toolbar-icon" title="设置" data-type="setting"><span class="octicon octicon-gear"></span></div>
    </div>
    <div id="sidebar" style="height: 702px;">
        <div id="sidebar-status">
            状态: <span id="sidebar-status-icon" style="color: rgb(189, 195, 199);">●</span>
            <span id="sidebar-status-text">完成</span>
        </div>

        <div id="sidebar-note-list">

        </div>
    </div>
    <div id="layout" style="padding-left: 288px;">
        <div id="test-editormd"></div>
    </div>

    <div id="tips-menu-1" class="contextmenu">
        <div class="contextmenu-item" onclick="noteContextClick('open');">		<i class="fa fa-file" aria-hidden="true"></i> 打开</div>
        <div class="contextmenu-item" onclick="noteContextClick('rename');">	<i class="fa fa-edit" aria-hidden="true"></i> 编辑</div>
        <div class="contextmenu-item" onclick="noteContextClick('clone');">		<i class="fa fa-copy" aria-hidden="true"></i> 复制</div>
        <!-- <div class="contextmenu-item" onclick="noteContextClick('share');">		<i class="fa fa-share-alt" aria-hidden="true"></i> Share</div> -->
        <!-- <div class="contextmenu-item" onclick="noteContextClick('export');">	<i class="fa fa-external-link " aria-hidden="true"></i> Export</div> -->
        <div class="contextmenu-item" onclick="noteContextClick('share');"><i class="fa fa-share-alt" aria-hidden="true"></i> 共享</div>
        <div class="contextmenu-item" onclick="noteContextClick('delete');">		<i class="fa fa-trash" aria-hidden="true"></i> 删除</div>
        <div class="contextmenu-item" data-type="properties">	<i class="fa fa-info-circle" aria-hidden="true"></i> 属性</div>
    </div>
    <div id="tips-menu-2" class="contextmenu">
        <div class="contextmenu-item" onclick="noteContextClick('rename');">	<i class="fa fa-edit" aria-hidden="true"></i> 编辑</div>
        <div class="contextmenu-item" onclick="noteContextClick('delete');">		<i class="fa fa-trash" aria-hidden="true"></i> 删除</div>
    </div>

    <!--显示文件的属性-->
    <div id="page-glass"></div>
    <div id="sidebar-properties">
    </div>
    <!--/end-->

    <!--<input id="float-input" type="text">
    <div id="float-notsaved-lable">●</div>-->
</div>

<script src="{RESOURCES_PATH}/editor.md/js/jquery.min.js"></script>
<script src="{RESOURCES_PATH}/layui/layui.js"></script>
<script src="{RESOURCES_PATH}/editor.md/editormd.js"></script>
<script src="{RESOURCES_PATH}/static/js/md5.js"></script>
<script type="text/javascript">
    var site_url = "{url(['act' => 'login', 'mod' => 'site'])}";
</script>
<script src="{RESOURCES_PATH}/static/js/request.js"></script>
<script type="text/javascript">
    //初始化layui
    layui.use(['form', 'layer', 'laytpl'], function () {
        var form  = layui.form, layer = layui.layer, laytpl = layui.laytpl;

        var active = {
            //设置
            setting: function () {
                layer.open({
                    type: 1
                    ,title: '设置'
                    ,content: $('#setting')
                    ,maxmin: true
                    ,area: ['500px', '450px']
                    ,btn: ['确定', '取消']
                    ,yes: function(index, layero){
                        //监听提交
                        form.on('submit(btn-setting)', function(data){
                            var field = data.field; //获取提交的字段
                            layer.msg(JSON.stringify(field));
                            //提交 Ajax 成功后，静态更新表格中的数据
                            //$.ajax({});
                            layer.close(index); //关闭弹层
                            return false;
                        });
                        $('.layui-btn-fluid').trigger('click');
                    }
                    ,success: function (layero, index) {
                        let obj = $('#setting');
                        obj.removeClass('layui-hide').addClass('layui-show');
                    }
                });
            },
            properties: function () {
                $('#tips-menu-1').hide(150);
                updateStatusBar("#f1c40f", "载入属性中...");
                let id = localStorage.getItem('id_right_click');
                doRequest('POST', "{url(['act' => 'note', 'action' => 'getNoteSettings'])}", {id: id}).then(function (data) {
                    let info = data.data;
                    let tpl  = document.getElementById('sidebar-properties-tpl').innerHTML;
                    let view = document.getElementById('sidebar-properties');
                    laytpl(tpl).render(info, function (html) {
                        view.innerHTML = html;
                        toggleProperty(true);
                        updateStatusBar("#0f2", "属性载入成功");
                    });
                });
            }
        };

        $('.toolbar-icon, .contextmenu-item').on('click', function(){
            let type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });

        //直接解析字符
        doRequest("GET", "{url(['act' => 'note', 'action' => 'noteBookList'])}", {}, false).then(function (data) {
            let noteList = data.data;
            let getTpl   = document.getElementById('sidebar-note-list-tpl').innerHTML
                ,view    = document.getElementById('sidebar-note-list')
                ,headTpl = document.getElementById('header-user-tpl').innerHTML
                ,head    = document.getElementById('header');
            laytpl(getTpl).render(noteList, function(html) {
                view.innerHTML = html;
            });
            laytpl(headTpl).render(data.user, function (html) {
                head.innerHTML = html;
            })
        });

        //进入加载默认数据
        doRequest('GET', "{url(['act' => 'note', 'action' => 'getNote'])}", {}, false).then(function (md) {
            //效果
            updateStatusBar("#f1c40f", "载入中...");

            testEditor = editormd("test-editormd", {
                width: "100%",
                height: winHeight,
                //autoHeight : true,
                path : '{RESOURCES_PATH}/editor.md/lib/',
                theme : "dark",
                previewTheme : "dark",
                editorTheme : "pastel-on-dark",
                markdown : md.data.content,
                codeFold : true,
                //syncScrolling : false,
                saveHTMLToTextarea : true,    // 保存 HTML 到 Textarea
                searchReplace : true,
                //watch : false,                // 关闭实时预览
                htmlDecode : "style,script,iframe|on*",            // 开启 HTML 标签解析，为了安全性，默认不开启
                //toolbar  : false,             //关闭工具栏
                //previewCodeHighlight : false, // 关闭预览 HTML 的代码块高亮，默认开启
                emoji : true,
                taskList : true,
                tocm : true,                  // Using [TOCM]
                tex : true,                   // 开启科学公式TeX语言支持，默认关闭
                flowChart : true,             // 开启流程图支持，默认关闭
                sequenceDiagram : true,       // 开启时序/序列图支持，默认关闭,
                //dialogLockScreen : false,   // 设置弹出层对话框不锁屏，全局通用，默认为true
                //dialogShowMask : false,     // 设置弹出层对话框显示透明遮罩层，全局通用，默认为true
                //dialogDraggable : false,    // 设置弹出层对话框不可拖动，全局通用，默认为true
                //dialogMaskOpacity : 0.4,    // 设置透明遮罩层的透明度，全局通用，默认值为0.1
                //dialogMaskBgColor : "#000", // 设置透明遮罩层的背景颜色，全局通用，默认为#fff
                toolbarAutoFixed: false,
                imageUpload : true,
                imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp"],
                imageUploadURL : "{url(['act' => 'upload'])}",
                onload : function() {

                }
            });

            noteBookHighlight(md.data.book_id, false);
            updateStatusBar("#0f2", "载入成功");
        });

    });


    var NOTE_ID = 0;//NOTE_ID 默认显示一条数据
    var testEditor;
    var noteLoading = false;

    var noteContextID = 0, noteType = 0;

    function showNoteContext(item, event, id) {
        var e = event || window.event;
        var context = $(id);
        if (noteContextID) {
            $("#note-list-item-" + noteContextID).removeClass("note-list-item-contextmenu-show");
            noteContextID = 0;
        }
        context.hide();
        context.show(150);
        $(id).css({
            "top": e.clientY + 'px',
            "left": e.clientX + 'px'
        });
        noteContextID = parseInt($(item).attr("id").substring(15));
        noteType  = parseInt($(item).attr('data-type'));
        $(item).addClass("note-list-item-contextmenu-show");
        //保存数据
        localStorage.setItem('id_right_click', noteContextID);
    }
    function noteContextClick(operation) {
        switch (operation) {
            case "open":
                loadNote(noteContextID);
                break;
            case "rename":
                renameNote(noteContextID, noteType);
                break;
            case "clone":
                cloneNote(noteContextID);
                break;
            case "share":
                shareNote(noteContextID);
                break;
            case "export":
                break;
            case "delete":
                deleteNote(noteContextID);
                break;
        }
        $('#tips-menu-1').hide(150);
        $('#tips-menu-2').hide(150);
        if (noteContextID) {
            $("#note-list-item-" + noteContextID).removeClass("note-list-item-contextmenu-show");
            noteContextID = 0;
        }
    }
    //删除
    function deleteNote(id) {
        layer.confirm('确认删除？', {icon: 0, title: "提示"}, function (index) {

            updateStatusBar("#f1c40f", "删除中...");
            var loading = layer.load(); //0代表加载的风格，支持0-2

            doRequest('POST', "{url(['act' => 'note', 'action' => 'deleteNote'])}", {id: id}).then(function (data) {
                let item = '#note-list-item-' + id;
                let noteType = parseInt($(item).parent().find('.note-list-item-notebook-title').attr('data-type'));
                if (noteType) {
                    let listNumber = ($(item).parent().children(".note-list-item").size() - 1);
                    console.log('listNumber', listNumber);
                    if (listNumber === 1) {
                        $(item).parent().remove();
                    }else {
                        $(item).parent().animate({height: listNumber * 32 + "px"});
                    }
                }
                $(item).remove();

                if (data.data.id > 0) loadNote(data.data.id);

                updateStatusBar("#0f2", "删除成功");
                layer.close(loading);
            });

            layer.close(index);
        });
    }

    //编辑
    function renameNote(id, noteType) {
        layer.prompt({title: '请输入新名称', formType: 0}, function (title, index) {
            layer.close(index);
            updateStatusBar("#f1c40f", "编辑中...");

            doRequest('POST', "{url(['act' => 'note', 'action' => 'renameNote'])}", {title: title,id: id, type: noteType}).then(function (data) {
                var html = '';
                if (noteType) {
                    html  = '<i class="fa fa-angle-down fa-lg i-note-list-folder-arrow" aria-hidden="true" style="transform: rotate(-90deg);"></i>';
                    html += '<i class="fa fa-book" aria-hidden="true"></i>' + title;
                }else {
                    html = '<i class="fa fa-file-text" aria-hidden="true"></i>' + title;
                }
                $('#note-list-item-' + id).html(html);
                updateStatusBar("#0f2", "编辑成功");
            })
        });
    }

    //显示/隐藏 右侧弹出的属性框
    function toggleProperty(isShow)
    {
        var winw = window.innerWidth
            || document.documentElement.clientWidth
            || document.body.clientWidth;

        var s = "#sidebar-properties", p = "#page-glass";
        if (isShow) {
            $(s).css("left", winw + 'px');
            $(s).show(function () {
                $(s).animate({left: winw - 300 + 'px'}, 200);
                $(p).fadeIn(200);
            });
        }else {
            $(s).animate({left: winw + 'px'}, 200, function () {
                $(s).hide();
            });
            $(p).fadeOut(200);
        }
    }

    //退出
    function logout() {
        localStorage.removeItem('token');
        window.location.href = site_url;
    }

    //获取整个页面的高度
    var winHeight = window.innerHeight
        || document.documentElement.clientHeight
        || document.body.clientHeight;

    $(function() {

        winHeight = winHeight - 81;
        //高度设置
        $('#toolbar').css({height: winHeight + 'px'});
        $('#sidebar').css({height: winHeight + 'px'});

        //第一次进来 那么清掉所有的数据
        let storage = window.localStorage;
        let key = 0;
        for(let i=0;i<storage.length;i++){
            key = storage.key(i);
            if (key !== 'token') {
                localStorage.removeItem(key);
            }
        }

        //去掉右键事件
        document.getElementById("sidebar").oncontextmenu = function(e){
            return false;
        };
        //隐藏右侧弹出的属性框
        $("#page-glass").on('click', function () {
            toggleProperty(false);
        });


        //右键菜单关闭
        document.onclick = function (event) {
            var e = event || window.event;
            var doHide = true;
            $(".contextmenu").each(function () {
                let contextmenuPos = $(this).offset();
                if (contextmenuPos.left <= e.clientX && e.clientX <= contextmenuPos.left + $(this).width() &&
                    contextmenuPos.top <= e.clientY && e.clientY <= contextmenuPos.top + $(this).height()) {
                    doHide = false;
                }
            });
            if (doHide) {
                if (noteContextID) {
                    $("#note-list-item-" + noteContextID).removeClass("note-list-item-contextmenu-show");
                    noteContextID = 0;
                }
                $("#tips-menu-1").hide(150);
                $("#tips-menu-2").hide(150);
            }
        };

        //ctrl + s保存
        $(document).keydown(function (e) {
            if (e.ctrlKey && e.which === 83) {
                saveNote();
                return false;
            }
        });

        $(document).keyup(function (e) {
            //记录按下次数
            let number = localStorage.getItem(NOTE_ID);
            number = parseInt((number==='NaN' ? 0 : number)) + 1;
            localStorage.setItem(NOTE_ID, String(number));
            if (number > 100) {
                console.log('保存数据');
                localStorage.setItem(NOTE_ID, '0');//计数置为0
                saveNote();
            }
        });

        //定时保存
        setInterval(function () {
            let storage = window.localStorage;
            let key = 0;
            for(let i=0;i<storage.length;i++){
                key = storage.key(i);
                if (Math.floor(key) === parseInt(key)) {
                    let contentMd5 = localStorage.getItem(key + '_md5');
                    if (contentMd5) {
                        if (contentMd5 !== hex_md5(testEditor.getMarkdown())) {
                            console.log('保存时间',  new Date());
                            saveNote();
                        }
                    }
                }
            }
        }, 10000)
    });

    /**
     * 更新状态
     */
    function updateStatusBar(color, text)
    {
        document.getElementById("sidebar-status-icon").style.color = color;
        document.getElementById("sidebar-status-text").innerHTML = text;
    }

    /**
     * 目录折叠和展开
     */
    function toggleNotebook(item) {

        if ($(item).hasClass("notebook-opened")) {
            $(item).parent().animate({height: "32px"});
            $(item).children(".fa-angle-down").animate({rotation: -90});
        } else {
            $(item).parent().animate({height: $(item).parent().children(".note-list-item").size() * 32 + "px"});
            $(item).children(".fa-angle-down").animate({rotation: 0});
        }
        $(item).toggleClass("notebook-opened");
    }
    //rotation 扩展属性
    var matrixRegex = /(?:matrix\(|\s*,\s*)([-+]?[0-9]*\.?[0-9]+(?:[e][-+]?[0-9]+)?)/gi;
    var getMatches = function (string, regex) {
        regex || (regex = matrixRegex);
        var matches = [];
        var match;
        while (match = regex.exec(string)) {
            matches.push(match[1]);
        }
        return matches;
    };
    $.cssHooks["rotation"] = {
        get: function (elem) {
            var $elem = $(elem);
            var matrix = getMatches($elem.css("transform"));
            if (matrix.length !== 6) {
                return 0;
            }
            return Math.atan2(parseFloat(matrix[1]), parseFloat(matrix[0])) * (180 / Math.PI);
        },
        set: function (elem, val) {
            var $elem = $(elem);
            var deg = parseFloat(val);
            if (!isNaN(deg)) {
                $elem.css({
                    transform: "rotate(" + deg + "deg)"
                });
            }
        }
    };
    $.cssNumber.rotation = true;
    $.fx.step.rotation = function (fx) {
        $.cssHooks.rotation.set(fx.elem, fx.now + fx.unit);
    };

    /**
     * 左边目录高亮显示
     */
    function noteBookHighlight(id, isLoading)
    {
        console.log('NOTE_ID', NOTE_ID);
        if (isLoading) {
            var loading = layer.load(); //0代表加载的风格，支持0-2
        }

        var noteListItemId = "#note-list-item-" + NOTE_ID, currentNoteListItemId = "#note-list-item-" + id;
        if (NOTE_ID) {
            if (NOTE_ID === id) {
                updateStatusBar("#0f2", "载入成功");
                if (isLoading) layer.close(loading);
                return false;
            }
            $(noteListItemId).removeClass("note-list-item-selected2");
            if ($(noteListItemId).hasClass("note-list-item-subnote")) {
                if ($(noteListItemId).parent() !== $(currentNoteListItemId).parent()) {
                    $(noteListItemId).parent().children(".note-list-item-notebook-title").removeClass("note-list-item-selected");
                }
            }
        }
        NOTE_ID = id;
        noteListItemId = "#note-list-item-" + NOTE_ID;
        $(noteListItemId).addClass("note-list-item-selected2");
        if ($(noteListItemId).hasClass("note-list-item-subnote")) {
            $(noteListItemId).parent().children(".note-list-item-notebook-title").addClass("note-list-item-selected");
        }
        if (isLoading) layer.close(loading);
    }

    /**
     * 异步加载内容
     */
    function loadNote(id) {
        updateStatusBar("#f1c40f", "载入中...");
        noteBookHighlight(id, true);

        noteLoading = true;
        doRequest('POST', "{url(['act' => 'note', 'action' => 'getNote'])}", {id:id}).then(function (data) {
            testEditor.setValue('# '+data.data.content);
            updateStatusBar("#0f2", "载入成功");
            noteLoading = false;
        });
    }

    //新建文本
    function newNote(id, item) {
        layer.prompt({title: '请输入名称', formType: 0}, function (name, index) {
            layer.close(index);
            if (name == null) {
                layer.msg('未输入有效的名称', {icon: 2});
                return false;
            }
            updateStatusBar("#f1c40f", "提交中...");
            var loading = layer.load(); //0代表加载的风格，支持0-2

            doRequest('POST', "{url(['act' => 'note', 'action' => 'newNote'])}", {title: name, id: id}).then(function (data) {
                if (data.code !== 200) {
                    layer.close(loading);
                    updateStatusBar("#f00", "保存失败");
                    layer.msg(data.msg, {icon: 2});
                    return false;
                }
                var html = '';
                if (id>0) {
                    html = '<div id="note-list-item-'+data.data.id+'" class="note-list-item note-list-item-subnote" title="'+name+'" oncontextmenu="showNoteContext(this, event, \'#tips-menu-1\')" onclick="loadNote('+data.data.id+');">\n' +
                        '<i class="fa fa-file-text" aria-hidden="true"></i>\n' +
                        ''+name+'</div>';
                    $(item).before(html);
                    $(item).parent().animate({height: $(item).parent().children(".note-list-item").size() * 32 + "px"});
                }else {
                    html = '<div id="note-list-item-'+data.data.id+'" class="note-list-item note-list-item-single" title="'+name+'" oncontextmenu="showNoteContext(this, event, \'#tips-menu-1\')" onclick="loadNote('+data.data.id+')">\n' +
                        '<i class="fa fa-file-text" aria-hidden="true"></i>\n' +
                        ''+name+'</div><div class="note-list-item-single" style="height: 1px;"></div>';
                    $('.note-list-item-single:last').before(html);
                }

                layer.close(loading);
                updateStatusBar("#0f2", "保存成功");
                //高亮显示
                noteBookHighlight(data.data.id);
                testEditor.setMarkdown("欢迎使用在线云笔记");
            });
        });
    }

    //新建文件夹
    function newNotebook() {
        layer.prompt({title: '请输入名称', formType: 0}, function (name, index) {
            layer.close(index);

            if (name == null) {
                layer.msg('未输入有效的名称', {icon: 2});
                return false;
            }

            updateStatusBar("#f1c40f", "提交中...");
            var loading = layer.load(); //0代表加载的风格，支持0-2

            doRequest('POST', "{url(['act'=>'note','action'=>'newNotebook'])}", {title: name}).then(function (data) {
                if (data.code !== 200) {
                    layer.close(loading);
                    updateStatusBar("#f00", "保存失败");
                    layer.msg(data.msg, {icon: 2});
                    return false;
                }
                var html = '<div class="note-list-folder" style="height: 32px">\n' +
                    '                <div class="note-list-item note-list-item-notebook-title font-sub" oncontextmenu="showNoteContext(this, event, \'#tips-menu-2\')" onclick="toggleNotebook(this);">\n' +
                    '                    <i class="fa fa-angle-down fa-lg i-note-list-folder-arrow" aria-hidden="true" style="transform: rotate(-90deg);"></i>\n' +
                    '                    <i class="fa fa-book" aria-hidden="true"></i>\n' +
                    '                    '+name+'\n' +
                    '                </div>\n' +
                    '                <div class="note-list-item note-list-item-subnote2 font-plus" onclick="newNote('+data.data.id+', this);">\n' +
                    '                    <i class="fa fa-plus" aria-hidden="true"></i>\n' +
                    '                    新建\n' +
                    '                </div>\n' +
                    '            </div><div class="note-list-item-single" style="height: 1px;"></div>';
                $('.note-list-item-single:last').before(html);
                layer.close(loading);
                updateStatusBar("#0f2", "保存成功");
            });
        });
    }

    /**
     * 保存内容
     */
    function saveNote() {
        updateStatusBar("#f1c40f", "保存中...");
        let formData = {book_id:NOTE_ID, content: testEditor.getMarkdown()};
        console.log('saveNote', NOTE_ID);
        if (NOTE_ID<=0) {
            updateStatusBar("#f00", "保存失败");
            return false;
        }
        //本地保存数据 这个数据用于定时保存
        let key  = NOTE_ID + '_md5';
        console.log('key', key);
        console.log('formData', formData);
        localStorage.setItem(key, hex_md5(testEditor.getMarkdown()));

        doRequest('POST', "{url(['act' => 'note', 'action' => 'saveNote'])}", formData).then(function (data) {
            updateStatusBar("#0f2", "保存成功");
        });
    }

</script>
</body>

<!--表单设置-->
<div id="setting" class="layui-hide">
    <form class="layui-form" action="" style="padding: 20px;">
        <div class="layui-form-item">
            <label class="layui-form-label">设置1</label>
            <div class="layui-input-block">
                <input type="text" name="setting1" lay-verify="require" autocomplete="on" placeholder="请输入设置1" class="layui-input" autofocus="autofocus">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">设置2</label>
            <div class="layui-input-block">
                <input type="text" name="setting2" lay-verify="require" placeholder="请输入设置2" autocomplete="off" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn layui-btn-fluid" lay-submit="" lay-filter="btn-setting" style="display: none">立即提交</button>
            </div>
        </div>
    </form>
</div>

<!--右侧弹出框-->
<script id="sidebar-properties-tpl" type="text/html">
    <div id="sidebar-properties-header">
        <i class="fa fa-file-text fa-3x" aria-hidden="true"></i>
        <span id="sidebar-properties-header-notename">{{ d.title }}</span>
        <span id="sidebar-properties-header-notetype"></span>
    </div>
    <div id="sidebar-properties-body">
        <span class="sidebar-properties-body-label">标&nbsp;&nbsp;题</span><span id="sidebar-properties-body-name">{{ d.title }}</span><br>
        <span class="sidebar-properties-body-label">创建时间</span><span id="sidebar-properties-body-lastmodify">{{ d.created_at }}</span><br>
        <span class="sidebar-properties-body-label">最后修改</span><span id="sidebar-properties-body-lastaccess">{{ d.updated_at}}</span><br>
        <span class="sidebar-properties-body-label">共享地址</span><span id="sidebar-properties-body-shareurl"></span><br>
    </div>
</script>

<!--头部信息-->
<script id="header-user-tpl" type="text/html">
    <h1 id="header-title">{APP_NAME}</h1>
    <div id="header-user">
        <div id="header-user-head">
        <i class="fa fa-user fa-2x" aria-hiddem="true"></i>
        </div>
        <span id="header-user-name">{{ d.nickname }}</span>
        <span id="header-user-emailandlogout">{{ d.email }} | <a style="cursor: pointer;" onclick="logout()"> 退出</a></span>
    </div>
</script>

<!--左侧导航栏-->
<script id="sidebar-note-list-tpl" type="text/html">
    {{# layui.each(d, function(index, item) { }}
    {{# if(item.type <= 0){ }}
    <div id="note-list-item-{{ item.id }}" data-type="0" class="note-list-item note-list-item-single" title="{{ item.title }}"
         oncontextmenu="showNoteContext(this, event, '#tips-menu-1')" onclick="loadNote('{{ item.id }}')">
        <i class="fa fa-file-text" aria-hidden="true"></i>
        {{ item.title }}
    </div>
    <div class="note-list-item-single" style="height: 1px;"></div>
    {{# }else { }}
    <div class="note-list-folder" style="height: 32px">
        <div id="note-list-item-{{ item.id }}" data-type="1" class="note-list-item note-list-item-notebook-title font-sub" oncontextmenu="showNoteContext(this, event, '#tips-menu-2')" onclick="toggleNotebook(this);">
            <i class="fa fa-angle-down fa-lg i-note-list-folder-arrow" aria-hidden="true" style="transform: rotate(-90deg);"></i>
            <i class="fa fa-book" aria-hidden="true"></i>
            {{ item.title }}
        </div>
        {{# if(item.child.length > 0 ) { layui.each(item.child, function(j, note) { }}
        <div id="note-list-item-{{ note.id }}" data-type="0" class="note-list-item note-list-item-subnote" title="{{ note.title }}" oncontextmenu="showNoteContext(this, event, '#tips-menu-1')" onclick="loadNote('{{ note.id }}');">
            <i class="fa fa-file-text" aria-hidden="true"></i>
            {{ note.title }}
        </div>
        {{# });} }}
        <div class="note-list-item note-list-item-subnote2 font-plus" onclick="newNote('+item.id+', this);">
            <i class="fa fa-plus" aria-hidden="true"></i>
            新建
        </div>
    </div>
    <div class="note-list-item-single" style="height: 1px;"></div>
    {{# } }}
    {{# }); }}
    <div class="note-list-item-single" style="height: 1px;"></div>
    <div class="note-list-item font-plus" onclick="newNote(0, this);">
        <i class="fa fa-plus" aria-hidden="true"></i>
        新建
    </div>
</script>


</html>